<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=8" />
    <link rel="icon" href="/favicon.svg">
    <link rel="apple-touch-icon" sizes="180x180" href="/favicon.png">
    <link type="text/css" rel="stylesheet" href="style/fonts/font-jsmind.css" />
    <link type="text/css" rel="stylesheet" href="style/index.html.css" />
    <title>jsMind - Open Source Online Mind Map</title>
</head>

<body>
    <header>
        <h1><span class="icon-bolt"></span>jsMind</h1>
        <nav>
            <ul>
                <li><a href="//github.com/hizzgdev/jsmind" target="_blank"><span class="icon-github"></span>GitHub</a></li>
                <li><a action="create-shared-link" class="action-trigger"><span class="icon-lock"></span>Share</a></li>
            </ul>
        </nav>
        <div class="title-bar">
            <h2 id="jsmind_title" action="open-meta-panel" class="action-trigger"></h2>
        </div>
        <a name="top"></a>
    </header>

    <div id="layout" class="setting-panel-hidden">
        <div id="workbench" class="workbench">
            <div id="jsmind_container" class="jsmind-container"></div>
        </div>
        <aside id="jsmind_sidebar">
            <div class="title-bar"><label></label><span action="close-setting-panel"
                    class="icon-cross action-trigger"></span></div>
            <section id="section_edit_metadata" class="section-edit-metadata">
                <div class="section-title">Metadata</div>
                <div class="section-body">
                    <label>Title</label><input type="text" name="name" placeholder="title of mindmap">
                    <label>Author</label><input type="text" name="author" placeholder="your name or email">
                    <label>Version</label><input type="text" name="version" placeholder="version">
                </div>
            </section>
            <section id="section_share_via_link">
                <div class="section-title">Share via URL</div>
                <div class="section-body">
                    <p><sub>[Experimental]</sub></p>
                    <p>Share your mindmap with others via link.</p>
                    <ul class="notes">
                        <li>The share will expire after 1 hour.</li>
                        <li>The shared mindmap will be deleted.</li>
                        </ul>
                    <p><button action="share" class="action-trigger">Share</button></p>
                    <p id="share_progress">Creating the shared link to the mindmap.</p>
                    <code id="shared_link" class="multi-line"><a href="https://jsmind.online/#m/id">https://jsmind.online/#m/id</a></code>
                    </div>
            </section>
        </aside>
        <div id="jsmind_tools" class="jsmind-tools jsmind-tools-active">
            <ul class="menu">
                <li action="menu" class="menu-item action-trigger title"><span class="menu-icon icon-menu"></span><span
                        class="menu-text">Menu</span>
                </li>
                <li class="menu-item menu-divider"></li>
                <li action="empty" class="menu-item action-trigger">
                    <span class="menu-icon icon-wand"></span><span class="menu-text">New mindmap</span>
                </li>
                <li action="sample" class="menu-item action-trigger">
                    <span class="menu-icon icon-bolt"></span><span class="menu-text">Show sample</span>
                </li>
                <li class="menu-item menu-divider"></li>
                <li action="open" class="menu-item action-trigger">
                    <span class="menu-icon icon-upload"></span><span class="menu-text">Open local .jm file</span>
                </li>
                <li action="download" class="menu-item action-trigger">
                    <span class="menu-icon icon-download"></span><span class="menu-text">Download .jm file</span>
                    </li>
                <li class="menu-item menu-divider"></li>
                <li action="screenshot" class="menu-item action-trigger">
                    <span class="menu-icon icon-camera"></span><span class="menu-text">Take a screenshot</span>
                </li>
                <li class="menu-item menu-divider"></li>
                <li class="menu-item"><span class="menu-icon icon-sphere"></span><span class="menu-text">Language</span>
                    <ul class="menu menu-language-options">
                        <li action="lang-zh" class="menu-item action-trigger">
                            <span class="menu-text">-- 中文</span>
                        </li>
                        <li action="lang-en" class="menu-item action-trigger">
                            <span class="menu-text">-- English</span>
                        </li>
                    </ul>
                </li>
            </ul>
            <div class="hidden-panel">
                <input type="file" id="jm_file_input" />
            </div>
        </div>
        <!-- <div id="jsmind_open_dialog" class="jsmind-open-dialog"> open </div> -->
        <br class="clear">
        </div>
        <div id="jsmind_error" class="jsmind-error">
            <div class="error-content">
                <span class="error-icon icon-warning"></span>
                <div class="error-message">
                    <p>Oh! The mindmap can not be found.</p>
                    <p>#00000000-0000-0000-0000-000000000000</p>
                </div>
                <div class="error-actions action-trigger-delegate">
                    <span action="empty" class="action-trigger">New</span>
                    <span action="sample" class="action-trigger">Sample</span>
                </div>
            </div>
        </div>
        <footer>
            <nav>
                <a href="/">&copy;jsmind.online 2022-2024</a>
            </nav>
        </footer>
</body>
<script type="text/javascript" src="js/index.html.js"></script>
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-3X8JTERR25"></script>
<script>
    window.dataLayer = window.dataLayer || [];
        function gtag() { dataLayer.push(arguments); }
        gtag('js', new Date());
        gtag('config', 'G-3X8JTERR25');
    </script>

</html>